/*
* hsycmsAlert 弹窗插件
* author @ http://www.hsycms.com 
*/
*{ margin:0px; padding:0px; box-sizing: border-box; -webkit-tap-highlight-color: rgba(255, 255, 255, 0);}
*:focus{ outline:none;}
ul,li{ list-style-type: none;}


.hsycms-model-mask{ width:100%; height:100%; display: none; position: fixed; left:0; top:0; background:rgba(0,0,0,0.7); z-index:2222;}
.hsycms-model{ position: fixed; z-index:13333;  display: none; left:0; right:0; margin:auto; top:50%; transform-origin: center; max-width:80%; max-height:80%; background:#fff; border-radius:5px; overflow: hidden;}
.hsycms-model.hsycms-model-alert,.hsycms-model.hsycms-model-confirm{ width:250px;}
.hsycms-model.hsycms-model-model{ width:400px;}
.hsycms-model.hsycms-model-success,.hsycms-model.hsycms-model-error{  padding:20px 12px; width:140px; }
.hsycms-model.hsycms-model-tips{ padding:8px 12px; max-width:150px; background:rgba(0,0,0,0.6); }
.hsycms-model.hsycms-model-tips .hsycms-model-text{ padding:0; color:#fff; }
.hsycms-model.hsycms-model-loading{  padding:20px 12px; width:100px; background:rgba(0,0,0,0.6); }
.hsycms-model.hsycms-model-loading .hsycms-model-text{ padding:0; color:#fff; }
.hsycms-model .hsycms-model-load{ display: flex; align-items: center; padding-top:10px; margin-bottom:15px; justify-content:center;}
.hsycms-model .hsycms-model-load span{ width:6px;  animation: hsycms-alert-load 1s ease infinite; transform: translateY(10px); animation-delay:0.1s; margin:0 5px; height:6px; opacity:0; border-radius:6px; background:#fff;}
.hsycms-model .hsycms-model-load span:nth-child(2){ animation-delay:0.2s;}
.hsycms-model .hsycms-model-load span:nth-child(3){ animation-delay:0.3s;}
.hsycms-model .hscysm-model-title{ padding:15px 0; opacity:0;  color:#333; transform: translateY(10px); animation: hsycms-alert-text 0.3s ease forwards; animation-delay:0.2s; font-weight:bold; font-size: 15px; text-align: center;}
.hsycms-model .hsycms-model-text{ font-size:14px; text-align: center; color:#333; line-height:23px; padding:0 20px;  opacity:0; transform: translateY(10px); animation: hsycms-alert-text 0.3s ease forwards; animation-delay:0.4s;}
.hsycms-model .hsycms-model-text.l{ text-align: left;}
.hsycms-model .hsycms-model-icon{ padding-bottom:12px;}
.hsycms-model .hsycms-model-icon svg{ margin:0 auto; display: block;}
.hsycms-model.hsycms-model-success .hsycms-model-text,.hsycms-model.hsycms-model-error .hsycms-model-text{ color:#238af4; padding:0; opacity:0; transform: translateY(10px); animation: hsycms-alert-text 0.3s ease forwards; animation-delay:0.9s; }
.hsycms-model.hsycms-model-error .hsycms-model-text{ color:#f54655}
.hsycms-model .hsycms-model-content{ padding:12px; padding-top:0; overflow: hidden auto; max-height:400px; font-size:14px;}
.hsycms-model .hsycms-model-btn{ display:flex; align-items: center; border-top:1px solid #f1f1f1; justify-content: center; margin-top:20px;  opacity:0; transform: translateY(10px); animation: hsycms-alert-text 0.4s ease forwards; animation-delay:0.6s;}
.hsycms-model .hsycms-model-btn button{ flex:1; color:#999; cursor: pointer; border:0; background:none; padding:12px;}
.hsycms-model .hsycms-model-btn button:last-child{ color:#238af4}
.hsycms-model .hsycms-model-btn button.cancel{ border-right:1px solid #f1f1f1;}
.hsycms-model .hsycms-model-btn button:active{ opacity:0.8;}

.hsycms-ani-open{ animation: hsycms-open 0.3s ease forwards; }
.hsycms-ani-close{ animation: hsycms-close 0.3s ease forwards; }

@-webkit-keyframes hsycms-open{  
   0%{ transform: scale(0); opacity:0;  } 
   100%{ transform: scale(1); opacity:1; }
}

@-webkit-keyframes hsycms-close{  
 0%{ transform: scale(1); opacity:1;  } 
 30%{ transform: scale(1.05); opacity: 0.5; }
 100%{ transform: scale(0.7); opacity: 0;}
}

.hsycms-alert-svgcircle{
   stroke-dasharray:200;
   stroke-dashoffset:200;
   animation: hsycms-alert-ruand 0.5s ease-in-out forwards
}

.hsycms-alert-svggou {
   stroke-dasharray:80;
   stroke-dashoffset:80;
   animation: hsycms-alert-tick .6s ease-out forwards;
   animation-delay: .75s;
}

.hsycms-alert-svgca1 {
 stroke-dasharray:80;
 stroke-dashoffset:80;
 animation: hsycms-alert-tick .6s ease-out forwards;
 animation-delay: .75s;
}

.hsycms-alert-svgca2 {
 stroke-dasharray:80;
 stroke-dashoffset:80;
 animation: hsycms-alert-tick .6s ease-out forwards;
 animation-delay: .85s;
}

@keyframes hsycms-alert-ruand {
 form{
  stroke-dashoffset:200;
 }
 to{
  stroke-dashoffset:400;
 }
}

@keyframes hsycms-alert-tick {
from {
stroke-dashoffset:80;
}
to {
stroke-dashoffset: 0;
}
}

@keyframes hsycms-alert-text {
 from {
  transform: translateY(10px);
  opacity: 0;
 }
 to {
  transform: translateY(0px);
  opacity: 1;
 }
 }

 @keyframes hsycms-alert-load {
  0% {
   transform: translateY(0px);
   opacity: 0;
  }
  50% {
   transform: translateY(-10px);
   opacity: 1;
  }
  100%{
   transform: translateY(0px);
   opacity: 0;
  }
  }




